<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>晓易崽</title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="index.css">
    <script
        src="https://lf1-cdn-tos.bytegoofy.com/obj/iconpark/icons_32320_15.01b57633deffdb3850fdd2ca25ce2bd9.js"></script>
    <link rel="stylesheet" type="text/css" href="../../node_modules/xterm/css/xterm.css">
</head>

<body>
    <div id="start">
        <img src="../../data/logo/logo.png">
    </div>
    <div id="page" style="display: none;">
        <img id="logo" src="../../data/logo/logo.png" />
        <ul id="nav" class="header">
            <li class="slide1"></li>
            <li class="slide2"></li>
            <li>
                <a href="#" data-target="bot">
                    <iconpark-icon name="robot-one-ckl0glo4" size='20px' class="nav_img"></iconpark-icon> Bot
                </a>
            </li>
            <li>
                <a href="#" data-target="plugins">
                    <iconpark-icon name="puzzle-ckl0h6cf" size='20px' class="nav_img"></iconpark-icon> 插件
                </a>
            </li>
            <li>
                <a href="#" data-target="account">
                    <iconpark-icon name="me" size='20px' class="nav_img"></iconpark-icon> 账号
                </a>
            </li>
            <li>
                <a href="#" data-target="set">
                    <iconpark-icon name="setting-two-ckl0ge0k" size='20px' class="nav_img"></iconpark-icon> 设置
                </a>
            </li>
            <li>
                <a href="#" data-target="other">
                    <iconpark-icon name="more-ckl0fkna" size='20px' class="nav_img"></iconpark-icon>其他
                </a>
            </li>
        </ul>
        <div id="icon_container">
            <a href="javascript:window_app('minimize')" class="fa fa-minus" id="minimize"></a>
            <a href="javascript:window_app('close')" class="fa fa-window-close-o" id="close"></a>
        </div>
        <div id="body">
            <img src="" id="body_img">
            <div id="body-background-color" style="display: none;"></div>
            <div id="prompt">
                <div id="prompt_copy"></div>
            </div>

            <div id="bot" class="body_page">
                <div id="bot_left" class="bot_page">
                    <ul id="bot_left_ul">
                        <li>
                            <div id="add">
                                <iconpark-icon name="plus-e0mndeei" size='120px'></iconpark-icon>
                            </div>
                        </li>
                    </ul>
                </div>
                <div id="bot_right" class="bot_page">
                    <div id="right_top">
                        <div class="none none_back_home"></div>
                        <a href="javascript:set_page()" class="right_top_thing back_home"
                            style="display: none;"><iconpark-icon name="back"></iconpark-icon>返回</a>
                        <div class="right_top_thing home_copy">主页</div>
                        <div class="none right_top_thing"></div>
                    </div>
                    <div id="right_page">
                        <div id="right_page_home">
                            <ul>
                                <li>
                                    <h3>欢迎</h3>
                                    <div class="copy">
                                        <p>欢迎使用晓易崽！</p>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div id="right_page_bot" style="display: none;"></div>
                    </div>
                </div>
                <div id="bot_set" style="display: none;">
                    <div id="set_left">
                        <div id="set_back">
                            <a href="javascript:set_back()"><iconpark-icon name="back"></iconpark-icon>返回</a>
                            <ul>
                                <li>
                                    <div class="bot_setting" data-target="bot_set_bot">
                                        <iconpark-icon name="page" size='19px'></iconpark-icon>
                                        开发中
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div id="set_right">
                        <div class="bot_setting_page_start" id="bot_set_bot">
                            <div class="operator_box">
                                <ul>
                                    <li>
                                        <span>开发中,敬请期待</span>
                                        <input type="checkbox" class="switch" />
                                    </li>
                                    <li>
                                        <span>开发中,敬请期待</span>
                                        <input type="checkbox" class="switch" />
                                    </li>
                                    <li>
                                        <span>开发中,敬请期待</span>
                                        <input type="checkbox" class="switch" />
                                    </li>
                                    <li>
                                        <span>开发中,敬请期待</span>
                                        <input type="checkbox" class="switch" />
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div id="plugins" class="body_page" style="display: none;">
                <div class="loading">
                    <div class="loading_page">
                        插件市场装修中...
                    </div>
                </div>
            </div>

            <div id="account" class="body_page" style="display: none;">
                <div id="account_page">
                    <div id="user_left">
                        <div class="user-avatar">
                            <img src="../../config/Pictures/preview.jpg">
                            <p id="username">请登录</p>
                        </div>
                        <div class="menu">
                            <button id="profile-button">个人资料</button>
                            <button id="user-test1-button">测试1</button>
                        </div>
                        <div class="bottom-section" style="display: none;">
                            <button id="user-logout-button">退出登录</button>
                        </div>
                    </div>
                    <div id="user_right">
                        <div class="login_content_start" id="login_content">
                            <div class="login_box">
                                <ul>
                                    <li>
                                        <div class="login-text">
                                            <p>登录</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="form-group">
                                            <label for="username-input">账户</label>
                                            <input type="text" id="username-input" name="username">
                                        </div>
                                    </li>
                                    <li>
                                        <div class="form-group">
                                            <label for="password-input">密码</label>
                                            <input type="password" id="password-input" name="password">
                                        </div>
                                    </li>
                                    <li>
                                        <button type="submit" id="login-button">登录</button>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div id="profile_content" class="profile_content" style="display: none;">
                            <!-- 个人资料内容 -->
                        </div>
                    </div>
                </div>
            </div>


            <div id="set" class="body_page" style="display: none;">
                <div id="setting_left">
                    <ul>
                        <li>
                            <div class="setting_start" data-target="starter">
                                <iconpark-icon name="page" size='19px'></iconpark-icon>
                                启动器
                            </div>
                        </li>
                    </ul>
                </div>
                <div id="setting_right">
                    <div class="setting_page_start" id="starter">
                        <div class="operator_box">
                            <ul>
                                <li>
                                    <span>开机自启动(开发中)</span>
                                    <input type="checkbox" class="switch" id="auto_start_bot" />
                                </li>
                                <li>
                                    <span>启动时检查更新(开发中)</span>
                                    <input type="checkbox" class="switch" id="check_updates" />
                                </li>
                                <li>
                                    <span>关闭时最小化到托盘</span>
                                    <input type="checkbox" class="switch" id="close_button" />
                                </li>
                                <li>
                                    <span>修改工作目录(开发中)</span>
                                    <div class="file_thing">
                                        <input type="text" id="file_data" readonly />
                                        <button onclick="dialog_path()">选择</button>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div id="other" class="body_page" style="display: none;">
                <div class="loading">
                    <div class="loading_page">
                        <p>制作中...</p>
                        <p>本版本为demo版本,不代表最终品质</p>
                        <p>后续制作计划如下:</p>
                        <ul>
                            <li>登录模块</li>
                            <li>bot设置页面</li>
                            <li>下载插件</li>
                            <li>插件论坛</li>
                            <li>开机自启动</li>
                            <li>自定义工作目录</li>
                            <li>切换动画等</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../../data/code/general.js"></script>
    <script src="index.js"></script>
</body>

</html>